<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.d {
				height: 299px;
				width: 299px;
				border: 20px solid red;
				border-radius: 50%;
				text-align: center;
				line-height: 200px;
			}
		</style>
		<script src="../js/jquery-3.3.1.min.js"></script>
		<script>
			$(function() {
				$("div").html("this is a div").addClass("d");
				alert("改变p元素");
				$("p a").css({
					"text-decoration": "none",
					"font-size": "40px",
					"color": "black"
				}).attr("href", "https://www.taobao.com").attr("target", "_blank");
			
				$(":button#hide").click(function(){
					//默认对象，this,但是this是dom
					if($(this).val()=="隐藏")
					{
						
						$("img#dog").hide(4000,function(){
							alert("图片不见鸟");
						});
						$(this).val("显示");
					}else{
						$("img#dog").show(3000);
						$(this).val("隐藏");
					} 
				});
			});
		</script>
	</head>

	<body>
		<p>
			<a href="#">淘宝</a>
		</p>
		<div>

		</div>
		<div>
		</div>
		<div>
		</div>
		<div>
		</div>
		<div>
		</div>
		<img src="../img/dog.jpg" id="dog" />
		<input type="button" value="隐藏" id="hide" />
	</body>

</html>